<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>练习</title>
		<style>
			div {
				width: 200px;
				height: 200px;
				border: 5px solid orange;
				/* 上下外间距100px 左右水平居中 */
				margin: 100px auto;
				/* 播放动画:动画名 执行时间 匀速播放 执行无限次*/
				animation: turn 3s linear infinite;
			}
			/* 鼠标悬停在div上 */
			div:hover {
				/* 动画播放状态：暂停 */
				animation-play-state:paused;
			}
			/* 制作动画脚本 */
			@keyframes turn {
				100% {
					transform: rotate(360deg);
				}
			}
		</style>
	</head>
	<body>
		<div></div>
	</body>
</html>